<script setup>
  import {nanoid} from 'nanoid'
  import {ref} from "vue";

  // emit 在父级组件中使用@XXX来进行绑定父级方法, 在子组件也就是当前组件中使用emits()进行触发
  const emits = defineEmits(['handleReceive'])

  const message = ref("")

  const handleAdd = () => {
    if (!message.value.trim()) return
    const tableItem = { id: nanoid(), title: message.value, done: true }
    emits('handleReceive', tableItem)
    message.value = ''
  }
</script>

<template>
  <el-input
      placeholder="请输入内容"
      v-model="message"
      @keyup.enter.native="handleAdd"
      clearable
  ></el-input>
</template>

<style scoped>

</style>
